<template>
  <div>
    <div class="Hreset-cen"></div>
    <div class="Hreset-fixed">
      <h2 class="Hreset-fixed-h2">
        个人信息

        <router-link to="/themeList">
        <a class="Hreset-fixed-back">
          <img src="../../images/goback.png">
          <span>返回</span>
        </a>
        </router-link>
      </h2>
    </div>
    <div class="head">

      <div class="Hd-sign-in">
        <a @click="signMe"><img src="../../images/cr-037.png"/></a>
      </div>
      <div class="a_headImg">
        <img :src="userIcon">
      </div>
      <div class="personDetail">
        <p class="personDetail-p1">{{userInfo.nickName}}</p>
        <p class="personDetail-p2">{{userInfo.mobile}}</p>
        <p class="personDetail-p3">
          <span class="person-apple-money">果币：</span>
          <span class="person-apple-num">{{gb.total}}</span>
          <span class="person-red-circle"></span>
        </p>
      </div>


      <div class="wave">
        <img src="../../images/cr-0119.png"/>
      </div>
    </div>

    <div class="dbjl" @click="dbRecordsGo">
      <div class="dbLeft">
        <img src="../../images/cr-020.png">
        <span>夺宝记录 </span>
      </div>
      <div class="dbRight">
        <p v-show="dbExist" class="dbRight-p2">
          <span>3笔记录进行中</span>
          <img src="../../images/cr-023.png"/>
        </p>
      </div>
    </div>

    <!--<div class="dbjl" @click="newsGo">
      <div class="dbLeft" >
        <img style="float: left;" src="../../images/cr-021.png">
        <span>我的评论</span>
      </div>
      <div class="dbRight">
        <p v-show="msgExist" class="dbRight-p2">
          <span>新消息</span>
          <img src="../../images/cr-023.png"/>
        </p>
      </div>
    </div>-->

    <div class="signOut">
      <button @click="logout">退出登录</button>
    </div>
  </div>
</template>

<script src="../common/js/fetch.js"></script>
<script>
  import { Toast } from 'mint-ui';
  import {getStore, setStore} from 'src/config/mUtils'
  import {userIndex,userSign} from '../../service/getData'
  export default {
    name: 'account',
    data () {
      return {
        newsUrl: null,
        accountData: {},
        userInfo: {},
        gb: {},
        userIcon: null,
        dbExist: false,
        msgExist: false,
        myyydbUrl: null,
        deviceId : null
      }
    },
    components: {
      Toast
    },
    mounted(){
      var uuid = localStorage.getItem("_uuid");
      if(uuid == null || uuid == ''){
        this.$router.push("/login");
      }else{
        var localDate = Date.parse(new Date());
        var deviceId =  getStore("_bbid");
        var _self = this;
        /*var url = "http://10.99.8.51:8080/flowcenter-activity/v9/private/" +
         getStore("_bbid")+"/user/index?lastTime="+localDate;*/
        /*var url = "http://hd.zt.raiyi.com/v9/private/" +
         getStore("_bbid")+"/user/index?lastTime="+localDate;*/
        userIndex(deviceId,localDate).then(json=>{
          console.log(json);
          _self.accountData = json.data;
          _self.myyydbUrl = _self.accountData.myyydbUrl;
          _self.userInfo = _self.accountData.userInfo;
          _self.gb = _self.accountData.gb;
          //_self.newsUrl = "http://10.99.8.51:8080/flowcenter-activity/v9/private/"+_self.deviceId+"/weibo/comment/msgList?showStartTime=111&shwoEndTime=222&pageIndex=0&pageSize=10";
          _self.newsUrl = "http://hd.zt.raiyi.com/v9/private/"+_self.deviceId+"/weibo/comment/msgList?showStartTime=111&shwoEndTime=222&pageIndex=0&pageSize=10";
          var iconR = _self.userInfo.icon;
          var dbordering = parseInt(_self.accountData.dbordering);
          if(dbordering > 0) {
            //此处先改成false
            _self.dbExist = false;
          }
          if(_self.accountData.weibo === 1){
            _self.msgExist = true;
          }
          if(iconR == null || iconR === 'undefined'){
            _self.userIcon = '../common/images/cr-022.png';
          }else{
            _self.userIcon = iconR;
            setStore('userIcon',iconR);
          }
        });
        /*fetch(url).then(function (response) {
         return response.json();
         }).then(function (json) {

         });*/
      }

    },
    created() {
      this.init();
    },
    computed: {
      length () {
        return this.items.length
      }
    },
    methods:{
      init() {
        this.deviceId = getStore("_bbid");
        //alert(this.deviceId);
      },
      dbRecordsGo(){
        location.href=this.myyydbUrl;
      },
      newsGo(){
        this.$router.push("/themeList");
      },
      signMe(){
        //var url = "http://10.99.8.51:8080/flowcenter-activity/v9/private/"+this.deviceId+"/sign/doSign?appCode=other_browser";
        //var url = "http://hd.zt.raiyi.com/v9/private/"+this.deviceId+"/sign/doSign?appCode=other_browser"
        userSign(this.deviceId,'other_browser').then(json=>{
          console.log(json);
          if(json.code == '5005'){
            Toast({
              message: json.msg.substring(3),
              duration: 3000
            });
            return
          }
          if(json.code == '0000'){
              this.gb.total = this.gb.total+1;
            Toast({
              message: '签到成功',
              duration: 3000
            });
          }
          //location.reload();
        });
        /*fetch()
         .then(function (response) {
         return response.json();
         }).then(function (json) {
         console.log(json);
         location.reload();
         });*/
      },
      logout(){
        localStorage.removeItem("_uuid");
        localStorage.removeItem("_bbid");
        localStorage.removeItem("userIcon");
        this.$router.push("/login");
      },
      closeTip(){
        this.showAlert = false;
      }
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<!--<style scoped>
  @import '../common/css/reset.css';
  @import '../common/css/account.css';
</style>-->
<style scoped>
  h1, h2 {
    font-weight: normal;
  }

  ul {
    list-style-type: none;
    padding: 0;
  }

  li {
    display: inline-block;
    margin: 0 10px;
  }

  a {
    color: #42b983;
  }
  .head {
    width: 100%;
    height: 11rem;
    position: relative;
    background: -webkit-linear-gradient(left, #2cb6ff , #2f90ff);
  }
  .Hd-sign-in{
    text-align: right;
    padding: 0.8rem 0.8rem 0.1rem 0.8rem;
  }
  .Hd-sign-in a{
    width: 3.5rem;
    display: inline-block;
  }
  .Hd-sign-in a img{
    width:100%;
    display: block;
  }
  .msg{
    height: 4rem;

  }
  .msg img{
    width: 1.5rem;
    float: right;
    padding: 2rem 2rem 0 0 ;
  }

  .personDesc {
    width: 100%;
    padding-top: 2.5rem;
  }

  .a_headImg {
    margin-left: 1rem;
    width: 3.2rem;
    height: 3.2rem;
    border-radius: 4px;
    float: left;
    overflow: hidden;
  }
  .a_headImg img{
    width: 100%;
  }
  .personDetail {
    float: left;
    padding-left: 1.5rem;
    width: 60%;
    text-align: left;
  }
  .personDetail p{
    color: #ffffff;
  }
  .personDetail-p1{
    font-size:1rem;
    padding-bottom: 0.2rem;
  }
  .personDetail-p2{
    font-size:0.9rem;
    padding-bottom: 0.4rem;
  }
  .personDetail-p3{
    background-color: #1675c1;
    border-radius: 1rem;
    font-size: 0.9rem;
    width:6rem;
    text-align:center;
    position: relative;
    line-height: 1.5rem;
  }
  .person-red-circle{
    display:none;
    width: 0.3rem;
    height: 0.3rem;
    background: #ff2244;
    border-radius: 50%;
    position: relative;
    top: -0.5rem;
    right: -0.2rem;
  }
  .person-apple-num{
    font-size:1rem;
    color:#fff;
  }
  .person-apple-money{
    font-size:0.8rem;
    color:#fff;
  }

  .dbjl {
    margin-top: 0.5rem;
    padding:0.8rem 1rem;
    border-bottom:1px solid #f2f2f2;
    overflow: hidden;
    background:#fff;
  }

  .dbLeft {
    float: left;
    font-size:0.9rem;
  }
  .dbLeft img {
    width:1.2rem;
    vertical-align: middle;
    margin-right:0.8rem;
    display:inline-block;
  }
  .dbLeft span{
    vertical-align: middle;
  }

  .dbRight {
    float: right;
    font-size:0.9rem;
  }

  .dbRight-p2 span{color:#ff0000;vertical-align: middle;padding-right:1rem;}
  .dbRight-p2 img{vertical-align: middle;width:0.5rem;}

  .signOut {
    text-align: center;
    margin: 2rem 0;
  }
  .signOut button{
    width: 85%;
    height: 3rem;
    background-color: #40AFFE;
    border: none;
    border-radius: 0.2rem;
    color: #ffffff;
    font-size: 0.9rem;
  }

  .wave {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: -0.5rem;
  }
  .wave img {
    width: 100%;
  ;

  }
  .signBtn {
    width: 3rem;
    height: 2rem;
    background-color: #ffffff;
    border: 1px solid ;
    font-size: 1rem;
  }
  /*头部的返回按钮*/
  .Hreset-cen{
    height:2.8rem;
    background:red;
  }
  .Hreset-fixed{position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:999;
  }
  .Hreset-fixed-h2{
    text-align: center;
    position: relative;
    background: #2e97ff;
    font-size: 1rem;
    color: #fff;
    height:2.8rem;
    line-height: 2.8rem;
  }
  .Hreset-fixed-back{
    position: absolute;
    top:0;
    left:0.8rem;
  }
  .Hreset-fixed-back img{
    display: inline-block;
    vertical-align: middle;
    width: 0.5rem
  }
  .Hreset-fixed-back span{
    display: inline-block;
    vertical-align: middle;
    font-size: 0.9rem;
    color:#fff;
  }


</style>
